{% extends 'buyer/base.html' %}

{% block title %}
    商品详情
{% endblock %}


{% block style %}

{% endblock %}


{% block content %}
    <div class="content content-nav-base datails-content">
        <div class="main-nav">
            <div class="inner-cont0">
                <div class="inner-cont1 w1200">
                    <div class="inner-cont2">
                        <a href="/Buyer/all_goods/0/" class="active">所有商品</a>
                        <a href="/Buyer/tuan_gou/">今日团购</a>
                        <a href="/Buyer/zi_xun/">母婴资讯</a>
                        <a href="/Buyer/jian_jie/">关于我们</a>
                    </div>
                </div>
            </div>
        </div>
        <div class="data-cont-wrap w1200">
            <div class="crumb">
                <a href="/Buyer/index/">首页</a>
                <span>></span>
                <a href="/Buyer/all_goods/0/">所有商品</a>
                <span>></span>
                <a href="/Buyer/detail/">产品详情</a>
            </div>
            <div class="product-intro layui-clear">
                <div class="preview-wrap">
                    <a href="javascript:;"><img src="{{ goods.goods_picture }}" style="width: 100%; height: 100%;"></a>
                </div>
                <div class="itemInfo-wrap">
                    <div class="itemInfo">
                        <div class="title">
                            <h4>{{ goods.goods_title }}</h4>
                            <span><i class="layui-icon layui-icon-rate-solid"></i>收藏</span>
                        </div>
                        <div class="summary">
                            <p class="reference"><span>参考价</span>
                                <del>￥{{ goods.goods_RP }}</del>
                            </p>
                            <p class="activity"><span>活动价</span><strong class="price"><i>￥</i>{{ goods.goods_current_price }}</strong></p>
                            <p class="address-box"><span>送&nbsp;&nbsp;&nbsp;&nbsp;至</span><strong class="address">江西&nbsp;&nbsp;南昌&nbsp;&nbsp;东湖区</strong>
                            </p>
                        </div>
                        <div class="choose-attrs">
                            <div class="color layui-clear"><span class="title">颜&nbsp;&nbsp;&nbsp;&nbsp;色</span>
                                <div class="color-cont"><span class="btn">白色</span> <span class="btn active">粉丝</span></div>
                            </div>
                            <div class="number layui-clear"><span class="title">数&nbsp;&nbsp;&nbsp;&nbsp;量</span>
                                <div class="number-cont"><span class="cut btn">-</span><input
                                        onkeyup="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}"
                                        onafterpaste="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}"
                                        maxlength="4" type="" name="" value="1"><span class="add btn">+</span></div>
                            </div>
                        </div>
                        <div class="choose-btns">
                            <button class="layui-btn layui-btn-primary purchase-btn">立刻购买</button>
                            <button class="layui-btn  layui-btn-danger car-btn"><i
                                    class="layui-icon layui-icon-cart-simple"></i>加入购物车
                            </button>
                        </div>
                    </div>
                </div>
            </div>
            <div class="layui-clear">
                <div class="aside">
                    <h4>热销推荐</h4>
                    <div class="item-list">
                        <div class="item">
                            <img src="/static/buyer/img/details_img2.jpg">
                            <p><span>可爱宝宝粉色连体秋裤</span><span class="pric">￥99.00</span></p>
                        </div>
                        <div class="item">
                            <img src="/static/buyer/img/details_img2.jpg">
                            <p><span>可爱宝宝粉色连体秋裤</span><span class="pric">￥99.00</span></p>
                        </div>
                        <div class="item">
                            <img src="/static/buyer/img/details_img2.jpg">
                            <p><span>可爱宝宝粉色连体秋裤</span><span class="pric">￥99.00</span></p>
                        </div>
                        <div class="item">
                            <img src="/static/buyer/img/details_img2.jpg">
                            <p><span>可爱宝宝粉色连体秋裤</span><span class="pric">￥99.00</span></p>
                        </div>
                        <div class="item">
                            <img src="/static/buyer/img/details_img2.jpg">
                            <p><span>可爱宝宝粉色连体秋裤</span><span class="pric">￥99.00</span></p>
                        </div>
                        <div class="item">
                            <img src="/static/buyer/img/details_img2.jpg">
                            <p><span>可爱宝宝粉色连体秋裤</span><span class="pric">￥99.00</span></p>
                        </div>
                    </div>
                </div>
                <div class="detail">
                    <h4>详情</h4>
                    <div class="item">
                        <img src="/static/buyer/img/details_imgbig.jpg">
                    </div>
                </div>
            </div>
        </div>
    </div>
{% endblock %}


{% block script %}
    <script type="text/javascript">
        layui.config({
            base: '/static/buyer/js/util/' //你存放新模块的目录，注意，不是layui的模块目录
        }).use(['mm', 'jquery'], function () {
            var mm = layui.mm, $ = layui.$;
            var cur = $('.number-cont input').val();
            $('.number-cont .btn').on('click', function () {
                if ($(this).hasClass('add')) {
                    cur++;

                } else {
                    if (cur > 1) {
                        cur--;
                    }
                }
                $('.number-cont input').val(cur)
            })

        });
    </script>
{% endblock %}